<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head th:replace="layout :: common_header(~{::title})">
    <title>电商知识库-[[${T(com.b2c.erp.DataConfigObject).getInstance().getSysName()}]]</title>

</head>
<body th:replace="layout :: common_body(~{::div.layui-body})">
<div class="layui-body" style="padding:15px;">
    <div class="layui-tab layui-tab-brief" lay-filter="demo">
        <ul class="layui-tab-title">
            <li><a href="/ecom/goods_keyword_list"><img src="/images/shuzi0.jpeg" width="20px" height="20px" />关键词库</a></li>
            <li><a href="/ecom/goods_style_data_list"><img src="/images/shuzi1.jpeg" width="20px" height="20px" />测款数据</a></li>
            <li class="layui-this"><a href="/ecom/goods_img_data_list"><img src="/images/shuzi2.jpeg" width="20px" height="20px" />测图数据</a></li>
            <li><a href="/ecom/goods_style_refer_list"><img src="/images/shuzi3.jpeg" width="20px" height="20px" />选款参考</a></li>
            <li class="layui-this"><a href="/ecom/article_list">电商知识库</a></li>
            
        </ul>
    </div>
    <!-- content starts -->
    <!--    <blockquote class="layui-elem-quote">订单总览</blockquote>-->

    <fieldset class="layui-elem-field">
        <legend>按条件搜索</legend>
        <div class="layui-field-box">
            <form class="layui-form layui-form-pane1" method="get" th:action="@{/ecom/article_list}">

                <div class="layui-form-item">
                    <div class="layui-inline">
                        <input type="text" name="title" th:value="${title}" placeholder="标题" class="layui-input" autocomplete="off" style="width: 200px">
                    </div>
   
                    <div class="layui-inline">
                        <div class="layui-input-inline">
                            <select name="platform" id="platform">
                                <option value="">平台</option>
                                <option value="TAO">淘宝</option>
                                <option value="PDD">拼多多</option>
                                <option value="DOU">抖音</option>
                            </select>
                        </div>
                    </div>


                    <div class="layui-inline">
                        <button type="submit" class="layui-btn">搜索</button>
                        <i>总共：<span style="color: red" th:text="${totalSize}"></span>条记录</i>
                    </div>
                    <div class="layui-inline">
                        <a href="javascript:;" id="add_data" class="layui-btn layui-btn-normal">添加数据</a>
                    </div>

                </div>

            </form>
        </div>
    </fieldset>

    <!-- start dd-wrapper -->
    <link rel="stylesheet" href="/goods/order.css"/>
    <div class="dd-wrapper">
        <table class="dd-table">
            <tr>
               <th>序号</th>
                <th>标题</th>
                <th>平台</th>
            
                
                <th>创建时间</th>
     
   
            </tr>
            <tr th:each="item:${lists}">
               <td th:text="${itemStat.index +1}"></td>

                <td>
                    <a class="view" href="javascript:;" th:attr="content=${item.content}" th:text="${item.title}"></p>
                </td>
                
                <td><p th:text="${item.platform}"></p></td>
               
                <td th:text="${item.createTime}"></td>
       
            </tr>
        </table>
    </div>
    <!-- end dd-wrapper -->
    <div class="layui-box layui-laypage layui-laypage-default pageBox">
        <paging:pager th:value="${pageIndex}" th:rows="${totalSize}" th:size="${pageSize}"/>
    </div>
    <div style="padding: 10px 10px 10px 10px;">

    </div>

    <script type="text/javascript">
        var layer;
        var $;
        var windowOpen;


        layui.use(['laydate', 'jquery', 'form', 'layer'], function () {
            var laydate = layui.laydate;
            $ = layui.jquery;
            var form = layui.form;
            layer = layui.layer;
            laydate.render({
                elem: '#startTime'
                ,type:'year'
            });

          
   
            var platform = '[[${platform}]]';
            $("#platform").val(platform);
            form.render();

            $(function () {
                $("#add_data").click(function(){
                    layer.open({
                        type: 2,
                        title: '添加新文章',
                        shadeClose: true,
                        shade: 0.8,
                        area: ['600px', '65%'],
                        content: '/ecom/article_add'
                    });
                })



                /*弹出层*/
                function getDiv(title, id, w, h) {
                    if (title == null || title == '') {
                        title = false;
                    }

                    if (w == null || w == '') {
                        w = ($(window).width() * 0.9);
                    }

                    if (h == null || h == '') {
                        h = ($(window).height() - 50);
                    }

                    layer.open({
                        type: 1,
                        area: [w + 'px', h + 'px'],
                        title: false,  //title: title,
                        fix: false, //不固定
                        maxmin: false,
                        shadeClose: true,
                        closeBtn: 2,//关闭按钮，0不显示，1和2两种风格;
                        anim: 3,//弹出动画,0~6;
                        shade: 0.6,//遮罩层
                        skin: 'layui-layer-nobg layer_bg', //没有背景色
                        content: $(id),
                    });
                }

                $(".view").click(function(){
                    var content = $(this).attr("content");
                    var html='<div style="padding: 10px 10px 10px 10px;">'+content+"</div>"
                    layer.open({
                        type: 1,
                        area: ['800px', '800px'],
                        title: false,  //title: title,
                        fix: false, //不固定
                        maxmin: false,
                        shadeClose: true,
                        closeBtn: 2,//关闭按钮，0不显示，1和2两种风格;
                        anim: 3,//弹出动画,0~6;
                        shade: 0.6,//遮罩层
                        //skin: 'layui-layer-nobg layer_bg', //没有背景色
                        content: html,
                    });
                })



            })
        });


    </script>


</div>
</body>
</html>
